<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <style media="screen">
      tr{
        height: 40px;
      }
      th{
        background-color: #f6f4f0;
      }
      td{
        text-align: center;
        min-width: 120px;
      }
    </style>
    <title>JavaScript事件</title>
  </head>
  <body>
    <h1>常见HTML事件</h1>
    <table border="1px">
      <tr>
          <th>事件</th>
          <th>描述</th>
      </tr>
      <tr>
        <td>onchange</td>
        <td>HTML元素改变</td>
      </tr>
      <tr>
        <td>onclick</td>
        <td>用户点击HTML元素</td>
      </tr>
      <tr>
        <td>onmouseover</td>
        <td>用户在一个HTML元素上移动鼠标</td>
      </tr>
      <tr>
        <td>onmouseout</td>
        <td>用户从一个HTML元素上移开鼠标</td>
      </tr>
      <tr>
        <td>onkeydown</td>
        <td>用户按下键盘按键</td>
      </tr>
      <tr>
        <td>onload</td>
        <td>浏览器已完成页面加载</td>
      </tr>
    </table>
  </body>
</html>
